import {
	createRouter,
	createWebHistory
} from 'vue-router';
const routes=[
    // 名人动态路由
    {
        path:'/',
        name:'home',
        component:()=>import('../components/karry.vue'),
        meta:{title:'名人动态'}//显示在浏览器标签页的标题
    },
    // 登录跳转，首页：名人动态
    {
        path:'/karry',
        name:'karry',
        component:()=>import('../components/karry.vue'),
        meta:{title:'名人动态'}
    },
    {
        path: '/chart',
		name: 'chart',
		component: () => import('../components/chart.vue'),
		meta: {title: '社交大厅',
        },
		// 实时聊天弹幕
    },
    {
        path: '/yourslife', //不加上参数,在调用时可加也可不加参数,更灵活,且地址栏不显示所传值
		name: 'yourslife',
		component: () => import('../components/yourslife.vue'),
		meta: {title: '晒晒生活',
            requireAuth:true,
        }
		// 粉丝动态分享
    },
    {
        path:'/mycontents',
        name:'mycintents',
        component:()=>import('../views/mycontents.vue'),
        meta:{title:'商城',
            requireAuth:true,
        },
        // 商城子页面
        children:[
            {
                path:'',
                redirect:'/mycontents/homemade'
            },
            {
                path:'homemade',
                name:'homemade',
                component:()=>import('../components/mall/homemade.vue'),
                meta:{title:'自制周边'}
            },
            {
				path: 'official',
				name: 'official',
				component: () => import('../components/mall/official.vue'),
				meta: {title: '官方商区'}
			},
            {
				path: 'mycollection',
				name: 'mycollection',
				component: () => import('../components/mall/mycollection.vue'),
				meta: {title: '我的购物车'}
			},
            {
				path: 'myorder',
				name: 'myorder',
				component: () => import('../components/mall/myorder.vue'),
				meta: {title: '我的订单'}
			}
        ]
    },
    {
        path:'/login',
        name:'login',
        component:()=>import('../views/login.vue'),
        meta:{title:'登录页面'}
        // 登录页面
    },
    {
        path:'/product/:id',
        name:'product-detail',
        component:()=>import('../views/ProductDetail.vue'),
        meta:{title:'商品详情',
            requireAuth:true,
        }
        // 商品详情页
    }
];

const router = createRouter({
	routes: routes,
	history: createWebHistory(),
});

//跳转之前进行判断，是否要求登录，还未实现后端动态登录,增加了批量管理路由的权限
router.beforeEach((to, from, next) => {
    // 从localStorage或sessionStorage获取登录状态
    const logged_in = localStorage.getItem('isLogin') === 'true' || sessionStorage.getItem('isLogin') === 'true';
    
    if(!logged_in && to.matched.some((item) => {
        return item.meta.requireAuth
    })){
        next('/login');
    } else {
        next();
    }
});
// 导航后守卫（跳转后）
router.afterEach(function(to,from){
    document.title = to.meta.title //跳转后设置页面的title
})

export default router;